<template>
  <div class="aui-wrapper aui-page__not-found">
    <div class="aui-content__wrapper"  v-loading="loading">
      <div v-if="!loading">
        <div v-if="noPermissions" class="aui-content">
        <img :src="$ossLink+'/app/backgroundimage/404.png'" style="width: 338px;height: 208px;" alt="">
        <div class="title-no">{{ $t('custom.bots.design.noPermissions') }}</div>
        <div class="desc-no">{{$t('custom.bots.design.permissionRequired')}}
          <span v-for="(item,index) in roles" :key="item.id">{{item.name}}<i v-if="index!==roles.length-1">,</i></span>
          .</div>
        <div class="desc-no">{{$t('custom.bots.design.contactAdmin')}}
          <span v-for="(item,index) in tenantManages" :key="item.id">{{item.realname}}<i v-if="index!==tenantManages.length-1">,</i></span>
         {{$t('custom.bots.design.changeRoles')}}
        </div>
        <div class="desc-no">{{$t('custom.bots.design.needAccess')}}</div>
        <div class="btn-bar">
          <el-button size="small"
                     @click="$router.go(-1)">{{ $t('notFound.back') }}</el-button>
          <el-button size="small"
                     type="primary"
                     @click="$router.replace({ name: 'home' })">{{ $t('notFound.home', { 'closeTime': closeTime }) }}</el-button>
        </div>
      </div>
      <div v-else class="aui-content">
        <h6 class="title">{{ $t('custom.bots.design.noPermissions') }}</h6>
        <p class="desc"
           v-html="$t('notFound.desc')"></p>
        <div class="btn-bar">
          <el-button size="small"
                     @click="$router.go(-1)">{{ $t('notFound.back') }}</el-button>
          <el-button size="small"
                     type="primary"
                     @click="$router.replace({ name: 'home' })">{{ $t('notFound.home', { 'closeTime': closeTime }) }}</el-button>
        </div>
      </div>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  data () {
    return {
      loading: false,
      noPermissions: false,
      closeTime: 10,
      timer: null,
      tenantManages: [],
      roles: []
    }
  },
  mounted () {
    this.timer = setInterval(() => {
      if (this.closeTime > 0) {
        this.closeTime--
      }
    }, 1000)
  },
  created () {
    var redirectedFrom = this.$route.redirectedFrom
    if (redirectedFrom) {
      var params = {}
      if (redirectedFrom.startsWith('/dashboard-')) {
        params.types = 'report'
        params.values = redirectedFrom.split('?')[1].split('&').find(item => item.includes('pageid=')).split('=')[1]
      } else if (redirectedFrom.startsWith('/dataset-')) {
        params.types = 'dataset'
        params.values = redirectedFrom.split('?')[1].split('&').find(item => item.includes('pageid=')).split('=')[1]
      } else {
        params.types = 'other'
        params.values = redirectedFrom
      }
      this.checkRole(params)
    }
  },
  watch: {
    closeTime (val) {
      if (val === 0) {
        clearInterval(this.timer)
        this.$router.replace({ name: 'home' })
      }
    }
  },
  methods: {
    checkRole (params) {
      this.loading = true
      this.$interface.system.postCheckRoleApi(params).then(({ data: res }) => {
        this.loading = false
        if (res.code !== 0) {
          return this.$message.error(res.msg)
        }
        if (res.data) {
          if (res.data.roles.length > 0) {
            this.noPermissions = true
          }
          this.tenantManages = res.data.tenantManages
          this.roles = res.data.roles
        }
      }).catch(() => { })
    }
  }
}
</script>
